<!DOCTYPE html>
<html lang="en">
    <head>
        <title>David Bardwell Homework 1 part 2 version 1</title>
        <meta charset="utf-8">
        <style type="text/css">
            canvas {
                border: 2px solid;
            }
        </style>
        
        <script type="text/javascript">
          window.onload = function() {
            // access the canvas element and its context
            var canvas = document.getElementById("testCanvas");
            var context = canvas.getContext("2d");
            
            // draw a bullseye of alternating read and blue colors
            // draw a circle
            context.fillStyle = "#FF0000";  // red
            context.beginPath();
            context.arc(200, 200, 200, 0, 2 * Math.PI, true);
            context.fill();
            context.closePath();
            
            context.fillStyle = "#0000FF";  // blue
            context.beginPath();
            context.arc(200, 200, 150, 0, 2 * Math.PI, true);
            context.fill();
            context.closePath();
            
            context.fillStyle = "#FF0000";  // red
            context.beginPath();
            context.arc(200, 200, 100, 0, 2 * Math.PI, true);
            context.fill();
            context.closePath();
            
            context.fillStyle = "#0000FF";  // blue 
            context.beginPath();
            context.arc(200, 200, 50, 0, 2 * Math.PI, true);
            context.fill();
            context.closePath();            
          };
         </script>
    </head>
    <body>
         <canvas id="testCanvas" width="400" height="400"> </canvas>
    </body>
</html>
